<template>
  <!-- 租赁项目 -->
  <div>
    <el-row>
      <el-select
        v-model="checkedData"
        :disabled="readonly"
        filterable
        remote
        reserve-keyword
        :placeholder="$t('请输入编号或名称')"
        :remote-method="remoteMethod"
        @change="changeData"
      >
        <el-option
          v-for="item in options"
          :key="item.id"
          :label="item.value + item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
    </el-row>
  </div>
</template>
<script>
import nonStandardService from '@/services/nonStandardService'
import eventBus from '@/assets/utils/eventBus.js'
export default {
  name: 'lease',
  props: {
    detail: {
      type: Object,
      default: () => {
        return {}
      },
    },
    value: [Object, String, Number],
    disabled: Boolean,
    parameter: {
      type: Object,
      default: () => {
        return {}
      },
    },
    type: Number,
    data: {
      type: Object,
      default: () => {},
    },
  },
  data() {
    return {
      options: [],
      checkedData: null,
      selectData: {},
      readonly: false,
      leaseType: 1,
      parkCode: localStorage.getItem('parkCode'),
    }
  },
  created() {
    this.readonly = Boolean(this.$route.query.readonly)
    if (this.value) {
      this.setData()
    } else {
      if (this.parkCode) {
        this.remoteMethod('')
      }
    }
    eventBus.$on('leaseTypeChange', (val) => {
      this.leaseType = val
      this.selectData = {}
      this.checkedData = ''
      this.options = []
      this.$emit('input', this.checkedData)
      this.remoteMethod('')
    })
  },
  methods: {
    /**远程搜索租赁项目数据 */
    remoteMethod(query) {
      if (!this.leaseType) {
        this.$message.error(this.$t('请先选择租赁类型'))
        return
      }
      let params = {
        tenantId: localStorage.getItem('tenantId'),
        parkCode: this.parkCode,
        codeOrName: query,
      }
      let requestApi = null
      if (this.leaseType == 1) {
        requestApi = nonStandardService.queryParkList(params)
      } else {
        requestApi = nonStandardService.queryAssetsList(params)
      }
      requestApi.then((res) => {
        if (res.code == 200) {
          let data = res.data.list || []
          this.options = data.map((it) => {
            return {
              ...it,
              value: it.resourceCode || it.assetsCode,
              label: it.resourceName || it.assetsName,
              id: it.resourceId || it.assetsId,
            }
          })
        }
      })
    },
    setData() {
      let leaseType =
        this.data.leaseType && this.data.leaseType.indexOf('{') === 0
          ? JSON.parse(this.data.leaseType)
          : {}
      if (leaseType.checkedData) {
        this.leaseType = leaseType.checkedData
      }
      this.selectData = JSON.parse(this.value).selectData
      this.options = [JSON.parse(this.value).selectData]
      this.checkedData = JSON.parse(this.value).checkedData
    },
    changeData(val) {
      this.selectData =
        (this.options && this.options.find((it) => it.value == val)) || {}
      eventBus.$emit('leaseChange', this.selectData)
      this.$emit('input', this.checkedData)
    },
    getData() {
      return {
        value: this.selectData.value + this.selectData.label,
        checkedData: this.checkedData,
        selectData: this.selectData,
      }
    },
  },
}
</script>
